import { BasicColumn, FormSchema } from '@/components/Table';
import { editSubAccount, getAuthRoleList } from '@/api/system/account';
import { h } from 'vue';
import { Switch } from 'ant-design-vue';
import { useMessage } from '@/hooks/web/useMessage';
import { fIntNumber } from '@/utils/formUtils';

export const columns: BasicColumn[] = [
  {
    title: '管理员账号',
    dataIndex: 'username',
  },
  {
    title: '姓名',
    dataIndex: 'real_name',
  },
  {
    title: '控制账号数',
    dataIndex: 'control_num',
    ifShow: false,
  },
  {
    title: '职位',
    dataIndex: 'job',
    width: 180,
  },
  {
    title: '管理员角色',
    dataIndex: 'role_name',
    width: 200,
  },
  {
    title: '账号有效期',
    dataIndex: 'expiration',
    ifShow: false,
  },
  {
    title: '最近登录IP',
    dataIndex: 'login_ip',
  },
  {
    title: '最近登录时间',
    dataIndex: 'login_time',
  },
  {
    title: '状态',
    dataIndex: 'status',
    customRender: ({ record }) => {
      if (!Reflect.has(record, 'pendingStatus')) {
        record.pendingStatus = false;
      }
      return h(Switch, {
        checked: record.status === 1,
        checkedChildren: '已启用',
        unCheckedChildren: '已禁用',
        loading: record.pendingStatus,
        disabled: !record.edit_status,
        onChange(checked: boolean) {
          record.pendingStatus = true;
          const newStatus = checked ? 1 : 0;
          const { createMessage } = useMessage();
          editSubAccount(
            {
              type: 'status',
              id: record.id,
              status: newStatus,
              control_num: record.control_num,
              expiration: record.expiration,
            },
            { AccessId: 3 },
          )
            .then(() => {
              record.status = newStatus;
              createMessage.success(`已成功修改角色状态`);
            })
            .catch(() => {
              createMessage.error('修改角色状态失败');
            })
            .finally(() => {
              record.pendingStatus = false;
            });
        },
      });
    },
  },
];

export const searchFormSchema: FormSchema[] = [
  {
    field: 'username',
    label: '管理员账号',
    component: 'Input',
  },
  {
    field: 'status',
    label: '账号状态',
    component: 'Select',
    componentProps: {
      style: {
        width: '100px',
      },
      options: [
        { label: '启用', value: 2 },
        { label: '停用', value: 1 },
      ],
    },
  },
];
export const accountFormSchema: FormSchema[] = [
  {
    field: 'sEditType',
    label: '用于判断是否是修改密码',
    component: 'Input',
    defaultValue: '1',
    show: false,
  },
  {
    field: 'username',
    label: '管理员账号',
    component: 'Input',
    required: true,
    rules: [
      {
        // @ts-ignore
        validator: async (rule, value) => {
          if (!value) {
            return Promise.reject('');
          }
          if (value.length < 3) {
            return Promise.reject('账号长度必须大于3');
          }
          const pwdRegex = /[a-zA-Z0-9]{3,32}$/;
          if (!pwdRegex.test(value)) {
            return Promise.reject('账号只能是数字和字母!');
          }
          return Promise.resolve();
        },
      },
    ],
    dynamicDisabled: ({ values }) => {
      return values.sEditType === '2' || values.sEditType === '3';
    },
  },
  {
    field: 'password',
    label: '密码',
    component: 'InputPassword',
    required: true,
    rules: [
      {
        // @ts-ignore
        validator: async (rule, value) => {
          if (!value) {
            return Promise.reject('');
          }
          if (value.length < 6) {
            return Promise.reject('密码长度必须大于6');
          }
          if (value.length > 16) {
            return Promise.reject('密码长度必须小于16');
          }
          const pwdRegex = /^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)[a-zA-Z0-9\W_]{6,16}$/;
          if (!pwdRegex.test(value)) {
            return Promise.reject('密码必须包含数字,字母,符号的的两种!');
          }
          return Promise.resolve();
        },
      },
    ],
    ifShow: ({ values }) => {
      return ['1', '3'].indexOf(values.sEditType) >= 0;
    },
  },
  {
    field: 'password_confirmation',
    label: '确认密码',
    component: 'InputPassword',
    required: true,
    ifShow: ({ values }) => {
      return ['1', '3'].indexOf(values.sEditType) >= 0;
    },
    dynamicRules: ({ values }) => {
      return [
        {
          required: true,
          validator: (_, value) => {
            if (!value) {
              return Promise.reject('密码不能为空');
            }
            if (value !== values.password) {
              return Promise.reject('两次输入的密码不一致!');
            }
            return Promise.resolve();
          },
        },
      ];
    },
  },
  {
    field: 'real_name',
    label: '姓名',
    component: 'Input',
    required: true,
    ifShow: ({ values }) => {
      return ['1', '2'].indexOf(values.sEditType) >= 0;
    },
  },
  {
    label: '职位',
    field: 'job',
    component: 'Input',
    required: true,
    ifShow: ({ values }) => {
      return ['1', '2'].indexOf(values.sEditType) >= 0;
    },
  },
  {
    label: '管理员角色',
    field: 'role',
    component: 'ApiSelect',
    dynamicDisabled: ({ values }) => {
      return values.sEditType === '3';
    },
    componentProps: {
      api: getAuthRoleList,
      params: {
        size: 1000,
        page: 1,
      },
      labelField: 'role',
      valueField: 'id',
      resultField: 'list',
    },
    required: true,
    rules: [
      {
        // @ts-ignore
        validator: async (rule, value) => {
          if (!value) {
            // return Promise.reject('管理员角色不能为空');
            return Promise.reject('');
          }
          setTimeout(() => {
            return Promise.resolve();
          }, 100);
        },
      },
    ],
  },
  {
    field: 'control_num',
    label: '控制账号数',
    component: 'InputNumber',
    componentProps: {
      min: 0,
      formatter: fIntNumber,
    },
    required: true,
    // ifShow: ({ values }) => {
    //   return ['1', '2'].indexOf(values.sEditType) >= 0;
    // },
    ifShow: false,
  },
  {
    field: 'expiration',
    label: '账号有效期',
    component: 'DatePicker',
    required: true,
    // ifShow: ({ values }) => {
    //   return ['1', '2'].indexOf(values.sEditType) >= 0;
    // },
    ifShow: false,
  },
  // {
  //   field: 'status',
  //   label: '状态',
  //   component: 'Select',
  //   required: true,
  //   defaultValue: 1,
  //   componentProps: {
  //     placeholder: '请选择状态',
  //     options: [
  //       { label: '启用', value: 1 },
  //       { label: '停用', value: 0 },
  //     ],
  //   },
  //   ifShow: ({ values }) => {
  //     return ['1'].indexOf(values.sEditType) >= 0;
  //   },
  // },
];
